<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
	<title>表格样式</title>
	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>
<body  style="margin:50px;" class="table-responsive">
<table class="table table-striped  table-bordered  table-hover">
	<thead>
	<tr>
		<th>编号</th>
		<th>姓名</th>
		<th>性别</th>
	    <th>年龄</th>
	 </tr>
	</thead>
	<tbody>
		<tr class="info">
			<td>1</td>
			<td>付小娟</td>
			<td>女</td>
			<td>22</td>
		</tr>
		<tr class="danger">
			<td>2</td>
			<td>杨小剑</td>
			<td>男</td>
			<td>24</td>
		</tr>
		<tr class="warning">
			<td>3</td>
			<td>周杰伦</td>
			<td>男</td>
			<td>31</td>
		</tr>
		<tr class="active">
			<td>4</td>
			<td>蔡依林</td>
			<td>女</td>
			<td>30</td>
		</tr>
		<tr class="success">
			<td>5</td>
			<td>罗志祥</td>
			<td>男</td>
			<td>30</td>
		</tr>
	</tbody>
</table>

<a href="###" class="btn btn-info">首页</a>
<a href="###" class="btn btn-default">下一页</a>
<a href="###" class="btn btn-danger">1</a>
<a href="###" class="btn btn-link">2</a>
<a href="###">3</a>
<a href="###"" class="btn btn-primary" class="btn btn-success">上一页</a> 
<a href="###" class="btn btn-warning">尾页</a>
<button class="btn btn-success btn-lg">1</button>
<button class="btn btn-info btn-sm">2</button>
<button class="btn btn-danger btn-xs">3</button>
<button class="btn btn-warning btn-block active">4</button>
<button class="btn btn-info active">5</button>
<button class="btn  disabled">6</button>
<script type="text/javascript" src="jquery/jquery-3.1.0.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
</body>
</html>